import { FC } from 'react';
import { Button, message, Modal } from 'antd';
import styles from '../../../pages/miner/minerModal.module.less';
import SvgIcon from '@/components/svg-icon/SvgIcon';
import { TaskParams } from '@/types/task';
import { fetchCommit } from '@/service/commit';

interface ITaskModalProps {
  visible: boolean;
  setVisible: (flag: boolean) => void;
  task: number;
  mid: number;
  miners: string[];
  mutateMiner: () => void;
}

function getMainText(task: number, count: number) {
  if (task === 1) {
    return `您所选的${count}个矿机将被执行"重启矿机"，是否确认操作？`;
  }
  if (task === 2) {
    return `您所选的${count}个矿机将被执行"关闭矿机"，是否确认操作？`;
  }
  if (task === 3) {
    return `您所选的${count}个矿机将被执行"重启矿机"，是否确认操作？`;
  }
  if (task === 4) {
    return `您所选的${count}个矿机将被执行"应用分组配置"，是否确认操作？`;
  }
  if (task === 5) {
    return `您所选的${count}个矿机将被执行"停止挖矿"，是否确认操作？`;
  }
  if (task === 6) {
    return `您所选的${count}个矿机将被执行"开始挖矿"，是否确认操作？`;
  }
  return '';
}

function getLine2Text(task: number) {
  if (task === 1) {
    return '相关重启矿机根据硬件属性完成重启的时间会不相同，重启成功后矿机状态会由“启动中”变为“在线”的状态（包括：正常，警告，异常，停机）';
  }
  if (task === 2) {
    return `相关矿机被关闭后，状态会变为“离线”，离线矿机可物理手动开机启动。如矿机主板支持“网络唤醒”，则可以通过“唤醒矿机”功能进行批量远程启动矿机操作。`;
  }

  if (task === 3) {
    return `部分异常情况可以通过重启挖矿操作排除，故障排查建议优先尝试重启挖矿操作。`;
  }

  if (task === 4) {
    return `相关矿机会应用最新的分组配置并重启挖矿。`;
  }
  if (task === 5) {
    return `停止挖矿后的矿机状态变为“停机”，可通过“开始挖矿”功能重新让矿机开始挖矿。`;
  }
  if (task === 6) {
    return `矿机状态需为“停机”时进行开始挖矿操作才会生效。`;
  }

  return '';
}

const TaskModal: FC<ITaskModalProps> = (props) => {
  const { visible, setVisible, mid, miners, task, mutateMiner } = props;

  const mainText = getMainText(task, miners.length);
  const line2Text = getLine2Text(task);

  const handleOk = () => {
    fetchCommit(task, [
      {
        monitor: mid,
        miners,
      },
    ])
      .then((res) => {
        if (res.data.code === 0) {
          setVisible(false);
          message.success('指令下发成功');
        }
      })
      .finally(() => {
        mutateMiner();
      });
  };

  return (
    <Modal
      title={null}
      centered
      visible={props.visible}
      closable={false}
      footer={null}
    >
      <div
        className={`flex flex-col ai-center text-center ${styles.groupModalWrap}`}
      >
        <SvgIcon symbol="icon-wenhao" color="var(--primary-color)" size={40} />
        <p className={styles.mainText}>{mainText}</p>
        <p className={styles.line2Text}>{line2Text}</p>
      </div>
      <div className={styles.groupModalBtnWrap}>
        <Button block type="primary" onClick={() => handleOk()}>
          确定
        </Button>
        <Button block onClick={() => setVisible(false)}>
          取消
        </Button>
      </div>
    </Modal>
  );
};

export default TaskModal;
